<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<title>N6_1F储位管理</title>
<%@include file="/WEB-INF/common/css.jsp"%>
<style>
.xtcardshow {
	width: 80%;
	height: 40px;
	color: #fff;
	text-align: center;
	line-height: 40px;
	border-radius: 50px;
}
</style>
<%@include file="/WEB-INF/common/topjs.jsp"%>
</head>
<body class="layui-layout-body">
	<div class="layui-layout layui-layout-admin">

		<%@include file="/WEB-INF/common/jsp/header.jsp"%>

		<!-- 内容主体区域 -->
		<div class="layui-container" style="padding: 15px;">
			<div class="layui-row">
				<div class="layui-col-md4" style="padding: 5px">
					<div class="layui-card">
						<div class="layui-card-header layui-bg-green">用户信息</div>
						<div class="layui-card-body">
							<p>工号: ${sessionScope.user.no }</p>
							<p>用户名: ${sessionScope.user.username }</p>
						</div>
					</div>
					<div class="layui-card" style="display: none">
						<div class="layui-card-header layui-bg-green">操作</div>
						<div class="layui-card-body">
							<p>
								<button class="layui-btn layui-btn-radius">更改信息</button>
								<button class="layui-btn layui-btn-radius layui-btn-normal">更改密码</button>
							</p>
						</div>
					</div>
					<%@include file="/WEB-INF/common/jsp/message.jsp" %>
				</div>
				<div class="layui-col-md8" style="padding: 5px">
					<div class="layui-card">
						<div class="layui-card-header layui-bg-cyan">储位变更 </div>
						<div class="layui-card-body">
							<hr>
							<h3>旧储位 &nbsp; &nbsp; &nbsp; &nbsp; <span id="totalShow"></span></h3>
							<hr>
							<form class="layui-form" action="" lay-filter="form">
								<div class="layui-form-item">
									<label class="layui-form-label">钢架编号</label>
									<div class="layui-input-block">
										<select name="oldgjNo" id="oldgjNo" lay-verify="required"
											lay-filter="oldgjNo">

										</select>
									</div>
								</div>
								<div class="layui-form-item">
									<label class="layui-form-label">大储位</label>
									<div class="layui-input-block">
										<select name="olddaChuwei" id="olddaChuwei" lay-verify="required"
											lay-filter="olddaChuwei">

										</select>
									</div>
								</div>
								<div class="layui-form-item">
									<label class="layui-form-label">小储位</label>
									<div class="layui-input-block">
										<select name="oldxiaoChuwei" id="oldxiaoChuwei"
											lay-verify="required" lay-filter="oldxiaoChuwei">

										</select>
									</div>
								</div>
							</form>
							<hr>
							<center>
								<i class="layui-icon layui-icon-down" style="font-size: 30px; color: #1E9FFF;"></i>
							</center>
							<hr>
							<h3>新储位</h3>
							<hr>
							<form class="layui-form" action="" lay-filter="form">
								<div class="layui-form-item">
									<label class="layui-form-label">钢架编号</label>
									<div class="layui-input-block">
										<select name="newgjNo" id="newgjNo" lay-verify="required"
											lay-filter="newgjNo">

										</select>
									</div>
								</div>
								<div class="layui-form-item">
									<label class="layui-form-label">大储位</label>
									<div class="layui-input-block">
										<select name="newdaChuwei" id="newdaChuwei" lay-verify="required"
											lay-filter="newdaChuwei">

										</select>
									</div>
								</div>
								<div class="layui-form-item">
									<label class="layui-form-label">小储位</label>
									<div class="layui-input-block">
										<select name="newxiaoChuwei" id="newxiaoChuwei"
											lay-filter="newxiaoChuwei">

										</select>
									</div>
								</div>
								<div class="layui-form-item">
									<div class="layui-input-block">
										<button class="layui-btn" lay-submit lay-filter="new">确定变更</button>
									</div>
								</div>
							</form>
						</div>
					</div>
				</div>
			</div>
		</div>

		<%@include file="/WEB-INF/common/jsp/footer.jsp"%>
		
		<table style="display:none" id="showTable" class="layui-table">
			<thead>
				<tr class=""  style="background: #399ddb;color: #fff">
					<th>序号</th>
					<th>机种</th>
					<th>类型</th>
					<th>状态</th>
					<th>暂放状态</th>
					<th>料号</th>
					<th>SN</th>
					<th>Input时间</th>
				</tr>
			</thead>
			
			<tbody></tbody>
		</table>
		
	</div>
	<%@include file="/WEB-INF/common/bottomjs.jsp"%>
	<script>
		$(function() {
			var form = layui.form;
			//监听提交
			form.on('submit(new)', function(data) {
				data.field.oldgjNo = $("#oldgjNo").val();
				data.field.olddaChuwei = $("#olddaChuwei").val();
				data.field.oldxiaoChuwei = $("#oldxiaoChuwei").val();
				var re = checkInput();
				if(re == "NA"){
					var imgSrc = ["0601.jpg", "11.gif", "14.gif", "16.gif", "21.gif", "4.gif"];
					var i = Math.floor(Math.random() * imgSrc.length);
					var conHtml = "<img width='300px' src='${base}/assets/image/alertemoj/"+imgSrc[i]+"' /><br>";
					conHtml += "<h3 style='text-align: center;font-size: 23px;margin-top: 27px;color:#d00d0d;font-weight: bold'>在移了哈</h3>";
					var alert1 = layer.open({
						title : "变更温馨小提示",
						content : conHtml,
						btn:[],
						closeBtn: 0
					});
					$.ajax({
						url : "${base}/api/dataDetails/auto/biangeng.api",
						type : "post",
						data : data.field,
						headers: Apicheck.getHeaders(),
						success: function(result){
							layer.close(alert1);
							if(result.code == 1001){
								layer.msg(result.msg, {icon: 6}); 
							}else{
								layer.msg(result.msg, {icon: 5}); 
							}
						}
					})
				}else{
					var imgSrc = ["0601.jpg", "11.gif", "14.gif", "16.gif", "21.gif", "4.gif"];
					var i = Math.floor(Math.random() * imgSrc.length);
					var conHtml = "<img width='300px' src='${base}/assets/image/alertemoj/"+imgSrc[i]+"' /><br>";
					conHtml += "<h3 style='text-align: center;font-size: 23px;margin-top: 27px;color:#d00d0d;font-weight: bold'>"+re+"</h3>";
					layer.open({
						title : "变更温馨小提示",
						content : conHtml,
						btn:[],
						cancel: function(index, layero){
							
						}
					});
				}
				return false;
			});

			initForm();
		})

		function initForm() {
			findGanjia("new");
			findGanjia("old");
		}
		var total = 0;
		function checkInput(){
			if($("#oldgjNo").val() == ""){
				return "你要移哪个钢架上的东东咧";
			}
			if($("#olddaChuwei").val() == ""){
				return "你要移" + $("#oldgjNo").val() + "钢架下的哪个大储位勒";
			}
			if($("#oldxiaoChuwei").val() == "" && $("#oldgjNo").val() == "D01"){
				return "钢架" + $("#oldgjNo").val() + "是有小储位的哟";
			}
			if(total == 0){
				return "在你选择的旧储位条件下呢，啥也木有";
			}
			var old ="";
			if($("#oldgjNo").val() == "D01"){
				 old = "钢架编号: " + $("#oldgjNo").val() + ",大储位: " + $("#olddaChuwei").val() + ",小储位: " + $("#oldxiaoChuwei").val();
			}else{
				 old = "钢架编号: " + $("#oldgjNo").val() + ",大储位: " + $("#olddaChuwei").val();
			}
			if($("#newgjNo").val() == ""){
				return "你要将"+old+"移到哪个钢架咧";
			}
			if($("#newdaChuwei").val() == ""){
				return "你要将"+old+"移到" + $("#newgjNo").val() + "钢架下的哪个大储位勒";
			}
			if($("#newxiaoChuwei").val() == "" && $("#newgjNo").val() == "D01"){
				return "钢架" + $("#newgjNo").val() + "是有小储位的哟";
			}
			return "NA";
		}
		function findGanjia(sign) {
			$.ajax({
				url : "${base}/api/gangjia/list.api",
				type : "post",
				data : {
					page : 1,
					size : 1000
				},
				headers: Apicheck.getHeaders(),
				success : function(result) {
					$("#"+sign+"gjNo").html("");
					$("#"+sign+"gjNo").append("<option value=''></option>");
					var list = result.data.list;
					for (var i = 0; i < list.length; i++) {
						$("#"+sign+"gjNo").append(
								"<option value='"+list[i].name+"'>"
										+ list[i].name + "</option>");
					}
					layui.form.render("select", "form");
					layui.form.on("select("+sign+"gjNo)", function(data) {
						$("#"+sign+"daChuwei").html("");
						$("#"+sign+"xiaoChuwei").html("");
						$("#"+sign+"daChuwei").val("");
						$("#"+sign+"xiaoChuwei").val("");
						findDachuwei(sign);
					});
				}
			});
		}

		function findDachuwei(sign) {
			$.ajax({
				url : "${base}/api/dachuwei/findByGanjias.api",
				type : "post",
				data : {
					ganjiaName : $("#"+sign+"gjNo").val()
				},
				headers: Apicheck.getHeaders(),
				success : function(result) {
					$("#"+sign+"daChuwei").html("");
					$("#"+sign+"daChuwei").append("<option value=''></option>");
					var list = result.data.dachuweis;
					for (var i = 0; i < list.length; i++) {
						$("#"+sign+"daChuwei").append(
								"<option value='"+list[i].name+"'>"
										+ list[i].name + "</option>");
					}
					layui.form.render("select", "form");
					layui.form.on("select("+sign+"daChuwei)", function(data) {
						$("#"+sign+"xiaoChuwei").html("");
						$("#"+sign+"xiaoChuwei").val("");
						if(sign=="old" && $("#"+sign+"gjNo").val() != 'D01'){
							findData();
						}else{
							findXiaochuwei(sign);
						}
					});
				}
			});
		}
		function findXiaochuwei(sign) {
			$.ajax({
				url : "${base}/api/xiaochuwei/findByDachuwei.api",
				type : "post",
				headers: Apicheck.getHeaders(),
				data : {
					dachuweiName : $("#"+sign+"daChuwei").val()
				},
				success : function(result) {
					$("#"+sign+"xiaoChuwei").html("");
					$("#"+sign+"xiaoChuwei").append("<option value=''></option>");
					var list = result.data.xiaochuwei;
					for (var i = 0; i < list.length; i++) {
						$("#"+sign+"xiaoChuwei").append(
								"<option value='"+list[i].name+"'>"
										+ list[i].name + "</option>");
					}
					layui.form.render("select", "form");
					layui.form.on("select("+sign+"xiaoChuwei)", function(data){
						if(sign == "old"){
							findData();
						}
					})
				}
			});
		}
		function findData(){
			total = 0;
			$.ajax({
				url : "${base}/api/dataDetails/auto/list.api",
				type : "post",
				data : {
					gjNo : $("#olddgjNo").val(),
					daChuwei : $("#olddaChuwei").val(),
					xiaoChuwei : $("#oldxiaoChuwei").val(),
					page: 1,
					size: 900000
				},
				headers: Apicheck.getHeaders(),
				success: function(data){
					console.log(data);
					total =  data.data.pager.recordCount;
					$("#totalShow").html("Total: " + data.data.pager.recordCount + "&nbsp; &nbsp; &nbsp; <a onclick='showTable("+data.data.pager.recordCount+")' href='#'>查看详情</a>");
					$("#showTable tbody").html("");
					var tbody = "";
					var list = data.data.list;
					for(var i = 0; i <list.length; i ++){
						tbody += "<tr>"
						tbody += "<td>" + (i +1) + "</td>";
						tbody += "<td>" + list[i].dataMachine + "</td>";
		    			tbody += "<td>" + list[i].dataItem + "</td>";
		    			tbody += "<td>" + list[i].dataGJEHState + "</td>";
		    			tbody += "<td>" + list[i].dataTempputState + "</td>";
		    			tbody += "<td>" + list[i].liaohao + "</td>";
		    			tbody += "<td>" + list[i].sn + "</td>";
		    			tbody += "<td>" + list[i].updateTime + "</td>";
		    			tbody += "</tr>"
					}
					$("#showTable tbody").html(tbody);
				}
			})
		}
		
		function showTable(total){
			var title = "钢架编号: " + $("#oldgjNo").val() + ", 大储位: " + 	$("#olddaChuwei").val()	
					+ ", 小储位: " + $("#oldxiaoChuwei").val() + " 数量: " + total;
			layer.open({
				type: 1,
				title: title,
				content: $('#showTable'),
				area: ['800px', '800px'],
				cancel: function(e){
					$("#showTable").hide();
				}
			});
		}
	</script>
</body>
</html>